import Vue from 'vue'
import VueRouter from 'vue-router'
import Layout from '@/layout/index'

Vue.use(VueRouter)

// vue-router路由版本更新产生的问题,导致路由跳转失败抛出该错误，但并不影响程序功能
const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push (location, onResolve, onReject) {
  if (onResolve || onReject) return originalPush.call(this, location, onResolve, onReject)
  return originalPush.call(this, location).catch(err => err)
}

const routes = [{
  path: '/login',
  name: 'login',
  component: () => import('@/views/login'),
  hidden: true
},
{
  path: '/',
  name: 'Home',
  component: Layout,
  redirect: '/home', // TODO: 这里如果注释掉 则无法通过按钮跳转到首页
  // redirect: {
  //   name: 'home'
  // },
  meta: {
    icon: 'el-icon-s-home',
    title: '首页'
  },
  children: [{
    path: '/home',
    name: 'home',
    component: () => import('@/views/home'),
    meta: {
      title: '首页'
    }
  }]
},
{
  path: '/dataCenter',
  name: 'dataCenter',
  component: Layout,
  redirect: '/dataCenter/form',
  meta: {
    icon: 'el-icon-s-data',
    title: '数据中心'
  },
  children: [
    // {
    //   path: '/dataCenter/echart',
    //   name: 'echart',
    //   component: () => import('@/views/dataCenter/echart'),
    //   meta: {
    //     title: '可视化'
    //   }
    // },
    {
      path: '/dataCenter/userAnalysis',
      name: 'userAnalysis',
      component: () => import('@/views/dataCenter/userAnalysis'),
      meta: {
        title: '用户数据分析',
        roles: ['admin']
      }
    },
    {
      path: '/dataCenter/healthyAnalysis',
      name: 'healthyAnalysis',
      component: () => import('@/views/dataCenter/healthyAnalysis'),
      meta: {
        title: '打卡数据分析',
        roles: ['admin']
      }
    },
    {
      path: '/dataCenter/leaveAnalysis',
      name: 'leaveAnalysis',
      component: () => import('@/views/dataCenter/leaveAnalysis'),
      meta: {
        title: '请假数据分析',
        roles: ['admin']
      }
    },
    {
      path: '/dataCenter/feedbackAnalysis',
      name: 'feedbackAnalysis',
      component: () => import('@/views/dataCenter/feedbackAnalysis'),
      meta: {
        title: '反馈数据分析',
        roles: ['admin']
      }
    }
  ]
},
{
  path: '/manageCenter',
  name: 'manageCenter',
  component: Layout,
  redirect: '/manageCenter/form',
  meta: {
    icon: 'el-icon-s-tools',
    title: '管理中心'
  },
  children: [
    // {
    //   path: '/manageCenter/form',
    //   name: 'form',
    //   component: () => import('@/views/manageCenter/form'),
    //   meta: {
    //     title: '表单组件'
    //   }
    // },
    // {
    //   path: '/manageCenter/table',
    //   name: 'table',
    //   component: () => import('@/views/manageCenter/table'),
    //   meta: {
    //     title: '表格组件'
    //   }
    // },
    {
      path: '/manageCenter/userManage',
      name: 'userManage',
      component: () => import('@/views/manageCenter/userManage'),
      meta: {
        title: '用户管理',
        roles: ['admin']
      }
    },
    {
      path: '/manageCenter/healthyManage',
      name: 'healthyManage',
      component: () => import('@/views/manageCenter/healthyManage'),
      meta: {
        title: '打卡管理',
        roles: ['admin']
      }
    },
    {
      path: '/manageCenter/leaveManage',
      name: 'leaveManage',
      component: () => import('@/views/manageCenter/leaveManage'),
      meta: {
        title: '请假管理',
        roles: ['admin']
      }
    },
    {
      path: '/manageCenter/feedbackManage',
      name: 'feedbackManage',
      component: () => import('@/views/manageCenter/feedbackManage'),
      meta: {
        title: '反馈管理',
        roles: ['admin']
      }
    }
    // {
    //   path: '/manageCenter/echart',
    //   name: 'echart',
    //   component: () => import('@/views/manageCenter/echart'),
    //   meta: {
    //     title: '可视化'
    //   }
    // }
  ]
},
{
  path: '/power',
  name: 'Power',
  component: Layout,
  redirect: '/power',
  meta: {
    icon: 'el-icon-s-custom',
    title: '权限页面'
  },
  children: [{
    path: '/power',
    name: 'power',
    component: () => import('@/views/power'),
    meta: {
      title: '权限页面',
      roles: ['admin']
    }
  }]
},
{
  path: '/404',
  component: () => import('@/views/404'),
  hidden: true
},
{
  path: '*',
  redirect: '/404',
  hidden: true
}
]

const router = new VueRouter({
  // mode: 'history',
  // 解决vue框架页面跳转有白色不可追踪色块的bug
  scrollBehavior (to, from, savedPosition) {
    return {
      x: 0,
      y: 0
    }
  },
  routes
})

// 解决Loading chunk (\d)+ failed问题
router.onError((error) => {
  console.error(error)
  const pattern = /Loading chunk/g
  // const pattern = /Loading chunk (\d)+ failed/g
  const isChunkLoadFailed = error.message.match(pattern)
  const targetPath = router.history.pending.fullPath
  if (isChunkLoadFailed && error.type === 'missing') {
    // const targetPath = router.history.pending.fullPath
    router.push(targetPath)
  }
})

export default router
